<template>
	<view class="container">
		<view class="tui-padding">
		<!-- <view class="tui-title tui-top40">个性签名</view> -->
		<!-- <view class="tui-cells"> -->
			<view class="uni-textarea">
				<textarea class="tui-textarea"
				placeholder="可输入您的个性签名(爱好等)"
				maxlength="500"
				placeholder-class="tui-phcolor-color"
				v-model="newSign"
				focus="true" />
			</view>
			<!-- <textarea
				class="tui-textarea"
				:placeholder="sign"
				maxlength="500"
				placeholder-class="tui-phcolor-color"
				v-model="newSign"
				focus="true"
			/>
			<view class="tui-textarea-counter">0/500</view> -->
		<!-- </view> -->
		<button class="tui-btn tui-btn-block tui-green tui-fillet" @tap="save" hover-class="tui-green-hover">保存</button>
		</view>
	</view>
</template>

<script>
import { mapState, mapMutations, mapActions } from 'vuex';
import tuiButton from '@/components/button/button';
export default {
	computed: mapState(['sign']),
	components: {
		tuiButton
	},
	data() {
		return {
			newSign:''
		};
	},
	methods: {
		...mapMutations(['setUserInfo']),
		save(){
			let postData = { sign: this.newSign };
			this.tui
				.request('/auth/api/member/update', postData, 'POST', false, true)
				.then(res => {
					if (res.code == 0) {
						this.tui.toast('更新成功', 1000, true);
						this.setUserInfo({sign: this.newSign});
						uni.navigateTo({
							url: "userinfo"
						});
					}else{
						this.tui.toast('更新失败', 1000, true);
					}
				})
				.catch(res => {
					console.log(res);
				});
		}
	}
};
</script>

<style>
@import '../../static/style/thorui.css';

.container {
	padding: 30upx 0 80upx 0;
	box-sizing: border-box;
	overflow: hidden;
}

.tui-padding {
	padding: 0 30upx;
	box-sizing: border-box;
	overflow: hidden;
}

.tui-title {
	padding: 55upx 0 30upx 0;
	font-size: 32upx;
	color: #333;
	font-weight: bold;
}

.tui-flex {
	align-items: center;
}

.tui-triangle {
	margin-right: 30upx;
}
.tui-checkbox {
	margin-left: 60upx;
}
.tui-top40 {
	margin-top: 40upx;
}
/* 按钮样式 */
	.tui-btn{
		margin-top: 80rpx;
		margin-bottom: 26rpx;
		margin-right: 20rpx;
	}

</style>
